<!DOCTYPE HTML>
<html lang="es">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<title>Bilbon Ibili</title>
		<link rel="shortcut icon" href="img/favicon.ico">
		<link rel="stylesheet" type="text/css" href="css/bootstrap.css">
		<link rel="stylesheet" type="text/css" href="css/bootstrap-responsive.css">
		<!--[if lt IE 9]><script src="js/html5.js"></script><![endif]-->
	</head>
	<body>
	<form class="borde" action="resultados.php"method="post">
	<div class="navbar navbar-fixed-top">
			<div class="navbar-inner">
				<div class="container"> 
					<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> 
						<span class="icon-bar"></span> 
						<span class="icon-bar"></span> 
						<span class="icon-bar"></span> 
					</a> 
				<div class="nav-collapse">
					<ul class="nav pull-right">
						<li>
							<a href="index.html">Home</a>
						</li>
						<li>
							<a href="about.html">About</a>
						</li>
					</ul>
				</div>
			</div>
			<div align="center"> 
				<a href="index.html"><img src="img/LogoBI_small.png" border=0></a>
			</div>
		</div>
	</div> 
	<div class="container" align="center">
		<div class="row">
			<div class="span4">
			<p>
				<h4>Indique el origen y destino de su ruta:</h4>
				<br>
				<img src="img/origen.png" border=0>Lugar de origen: <select name="lugardeorigen">
					<option selected>Bolueta
					<option>Basarrate
					<option>Santutxu
					<option>Casco Viejo
					<option>Abando
					<option>Moyua
					<option>Indautxu
					<option>Sagrado Corazón
					<option>San Mamés
					<option>Deusto
					<option>Sarriko
					<option>San Ignacio
					<option>Hospital Basurto
					<option>Basurto
					<option>Rekalde
					<option>Zorroza
					<option>Atxuri
					<option>La Ribera
					<option>La Casilla
					<option>Pío Baroja
					<option>Uribitarte
					<option>Guggenheim
					<option>Abandoibarra
					<option>Euskalduna
					<option>Otxarkoaga
					<option>Txurdinaga
					<option>La Peña
					<option>Miribilla
					<option>Uribarri
				</select>
			<p>
				<img src="img/destino.png" border=0>Lugar de destino: <select name="lugardedestino">
					<option>Bolueta
					<option>Basarrate
					<option>Santutxu
					<option>Casco Viejo
					<option>Abando
					<option>Moyua
					<option>Indautxu
					<option>Sagrado Corazón
					<option>San Mamés
					<option>Deusto
					<option>Sarriko
					<option>San Ignacio
					<option>Hospital Basurto
					<option>Basurto
					<option>Rekalde
					<option selected>Zorroza
					<option>Atxuri
					<option>La Ribera
					<option>La Casilla
					<option>Pío Baroja
					<option>Uribitarte
					<option>Guggenheim
					<option>Abandoibarra
					<option>Euskalduna
					<option>Otxarkoaga
					<option>Txurdinaga
					<option>La Peña
					<option>Miribilla
					<option>Uribarri
				</select>
			</p>
			</div> <!-- End Span4 -->
			<div class="span4">
			<p>
				<h4>Indique el rango de temperatura preferida:</h4>
				<br>
					<img src="img/Thermometer_Quarter_Full.png" border=0>Temperatura mínima: 
					<input type="range" id="tempmin" name="tempminmt" min="-20" max="50" value="10" step="1" onchange="showValue(this.value, 'MIN')" />
					<span id="rangeMin">10</span> ºC
				<br>	
					<img src="img/Thermometer_Full.png" border=0>Temperatura máxima:
					<input type="range" id="tempmax" name="tempmaxmt" min="-20" max="50" value="30" step="1" onchange="showValue(this.value, 'MAX')" />
					<span id="rangeMax">30</span> ºC
				<br>
			</div> <!-- End span4 -->
			<div class="span4">
			<p>	
				<h4>Indique las inclemencias climáticas soportadas:</h4>
				<br>
					<img src="img/umbrella.png" border=0>Precipitaciones:
					<input type="radio" name="lluvianievemt" value="Mucho">No importa
					<input type="radio" name="lluvianievemt" value="Nada" checked>Nada
				<br>
				<br>
					<img src="img/wind.png" border=0>Viento:
					<input type="radio" name="vientomt" value="Mucho">No importa
					<input type="radio" name="vientomt" value="Nada" checked>Poco o nada
				<br>
				<br>
				<h4>Indique el tipo de ruta deseado:</h4>
				<br>
					<img src="img/foot_small.png" border=0>
					<input type="radio"	name="tipoRuta" value="Corta">Corta
					<input type="radio" name="tipoRuta" value="Rápida" checked>Rápida
				<br>
				<br>
			</div> <!-- End span4 -->
			<div class="span11">
				<h4>Ordene de mayor a menor preferencia los siguientes medios de transporte:</h4>
					<br>
					<p>
						Preferencia 1:
						<input type="radio" name="mediotransporte1" value="Bicicleta" checked><img src="img/bicicleta.png" border=0>
						<input type="radio" name="mediotransporte1" value="Metro"><img src="img/metro.png" border=0>
						<input type="radio" name="mediotransporte1" value="Tranvía"><img src="img/tram.png" border=0>
						<input type="radio" name="mediotransporte1" value="Autobús"><img src="img/bus.png" border=0>
						
					</p>
					<p>
						Preferencia 2:
						<input type="radio" name="mediotransporte2" value="Bicicleta"><img src="img/bicicleta.png" border=0>
						<input type="radio" name="mediotransporte2" value="Metro" checked><img src="img/metro.png" border=0>
						<input type="radio" name="mediotransporte2" value="Tranvía"><img src="img/tram.png" border=0>
						<input type="radio" name="mediotransporte2" value="Autobús"><img src="img/bus.png" border=0>
						
					</p>
					<p>
						Preferencia 3:
						<input type="radio" name="mediotransporte3" value="Bicicleta"><img src="img/bicicleta.png" border=0>
						<input type="radio" name="mediotransporte3" value="Metro"><img src="img/metro.png" border=0>
						<input type="radio" name="mediotransporte3" value="Tranvía" checked><img src="img/tram.png" border=0>
						<input type="radio" name="mediotransporte3" value="Autobús"><img src="img/bus.png" border=0>
						
					</p>
					<p>
						Preferencia 4: 
						<input type="radio" name="mediotransporte4" value="Bicicleta"><img src="img/bicicleta.png" border=0>
						<input type="radio" name="mediotransporte4" value="Metro"><img src="img/metro.png" border=0>
						<input type="radio" name="mediotransporte4" value="Tranvía"><img src="img/tram.png" border=0>
						<input type="radio" name="mediotransporte4" value="Autobús" checked><img src="img/bus.png" border=0>
						
					</p>
					<br>
			</div> <!-- End span4 -->
		</div> <!-- End row -->
	</div> <!-- End container -->
	<div class="container" align="center">
	<p>
		<input type="submit" name="buscar" value="Buscar" class="button">
		<br>
	</p>
	</div>
	</form>
	<script src="js/jquery-1.7.1.min.js"></script>
	<script src="js/bootstrap-transition.js"></script>
	<script src="js/bootstrap-collapse.js"></script>
	<script type="text/javascript">
		function showValue(newValue, minMax) {
			if (minMax == 'MIN')
				document.getElementById("rangeMin").innerHTML=newValue;
			else
				document.getElementById("rangeMax").innerHTML=newValue;
		}
	</script>
	</body>
	<div class="logos" align="center">
		<a href="about.html"><img src="img/LogoSS_small.png" border=0><br></a>
	</div>
	<div align=center>
		© 2014 Smart Solutions<br><br>
		Tema basado en un framework desarrollado por <a href="http://awfulmedia.com/" target="nueva"><strong> AwfulMedia</strong></a> con <a href="http://creativecommons.org/licenses/by/3.0/" target="nueva"><strong>licencia Creative Commons</strong></a><br>
	</div>
</html>
